<template>
	<!-- 密码登录 -->
	<view class="register_box bg-white" style="height: 100vh;">
		<view class="psd_login font" @click="goPages('./register')">验证码登录</view>
		<view class="reg_cont">
			<view class="font-weight-bold reg_big_text my-2">账号密码登录</view>
			<view class="font my-2">密码登录仅适用于已注册的登录</view>
			<view class="reg_from">
				<u--form labelPosition="left" :model="loginFrom" ref="loginFrom" :rules="rules">
					<u-form-item prop="username" borderBottom><u--input v-model="loginFrom.username" border="none" placeholder="账号/子账号"></u--input></u-form-item>
					<u-form-item prop="password" borderBottom>
						<u-input v-model="loginFrom.password" border="none" :password="isPwd ? false : true" placeholder="密码">
							<template slot="suffix">
								<u-icon :name="isPwd ? 'eye' : 'eye-off'" color="#999999" size="25" @click="pwdChange"></u-icon>
							</template>
						</u-input>
					</u-form-item>
				</u--form>
				<!-- <view class="flex justify-end h6">忘记密码</view> -->
			</view>
			<button class="c_6 my-3 font font-weight-bold font get_code" @click="pwdLogin">登录</button>
		</view>
		<view class="font flex agreement">
			<checkbox-group @change="agreement = !agreement"><checkbox value="协议" :checked="agreement" /></checkbox-group>
			<view class="font_24_2">
				<text class="c_9">阅读并接受</text>
				<text class="c_main">《索比用户协议》</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			loginFrom: {
				logType: 2, //1：验证码登录，2：账号密码登 ，3：微信登录
				username: '', //手机号
				password: '' //密码
			},
			rules: {
				username: [
					{
						type: 'string',
						required: true,
						message: '请填写手机号',
						trigger: ['blur', 'change']
					}
					// {
					// 	type: 'string',
					// 	required: true,
					// 	pattern: /^1(3\d|4[5-9]|5[0-35-9]|6[567]|7[0-8]|8\d|9[0-35-9])\d{8}$/,
					// 	message: '请填写正确的手机号',
					// 	trigger: ['blur', 'change']
					// }
				],
				password: [
					{
						type: 'string',
						required: true,
						message: '请填写密码',
						trigger: ['blur', 'change']
					},
					{
						message: '密码应为字母、数字或字母数字组合，6-14位',
						// pattern: /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,14}$/,
						pattern: /^[0-9A-Za-z]{6,14}$/,
						trigger: ['blur']
					}
				]
			},
			isPwd: false,
			agreement: false
		};
	},
	onReady() {
		this.$refs.loginFrom.setRules(this.rules);
	},
	methods: {
		// back() {
		// 	uni.navigateTo({
		// 		url: './wx_login'
		// 	});
		// },
		// 密码显示/隐藏
		pwdChange() {
			this.isPwd = !this.isPwd;
		},
		// 登录
		pwdLogin() {
			this.$refs.loginFrom
				.validate()
				.then(res => {
					if (this.agreement) {
						this.toLogin();
					} else {
						uni.showModal({
							title: '用户协议',
							content: '是否同意并接受用户协议？',
							success: res => {
								if (res.confirm) {
									this.agreement = true;
									this.toLogin();
								} else {
									uni.$u.toast('阅读并接受用户协议才可登录哦！');
									this.agreement = false;
									return;
								}
							}
						});
					}
				})
				.catch(errors => {
					uni.$u.toast('请填写正确的账号和密码');
				});
		},
		toLogin() {
			this.$store.dispatch('login/Login', this.loginFrom).then(() => {
				// 名片详情跳转过来的，登录成功后返回名片详情
				if (uni.getStorageSync('loginToPage').title == 'cardMain') {
					let msg = uni.getStorageSync('loginToPage');
					uni.navigateTo({
						url: '/subPages/my/list/card/card_main?id=' + msg.cardUid + '&exhibitionId=' + msg.exhibitionId
					});
					return;
				}
				uni.reLaunch({
					url: '/pages/my/index'
				});
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.register_box {
	padding: 59rpx 70rpx 0;
	.psd_login {
		text-align: right;
	}
	.reg_cont {
		margin-top: 174rpx;
		.reg_big_text {
			font-size: 52rpx;
		}
		.reg_from {
			margin-top: 110rpx;
		}
		.get_code {
			background-color: $color14; //#f2f2f2;
			color: $color2; //$color7;
			border-radius: 50rpx;
			margin-top: 119rpx;
		}
	}
	.agreement {
		margin-top: 40rpx;
	}
}
::v-deep uni-checkbox .uni-checkbox-input {
	width: 32rpx;
	height: 32rpx;
}
::v-deep .u-form-item__body__right__message {
	margin-left: 0 !important;
}
</style>
